// Resetting headers as webflow does not provide this in its normalize
h1, h2, h3, h4, h5, h6, label
  font-weight: normal
  margin: 0
  padding: 0

body
  word-wrap: break-word

img, iframe
  max-width: 100% !important

.list-answer
  display: none

.project-about, div.redactor-editor
  a
    color: #409ade
    text-decoration: none
  a:hover
    color: #409ade
    text-decoration: underline

.edit-project-div
  height: 520px

.project-about:after
  content: ""
  display: table
  clear: both

.required
  .field-label
    padding-top: 1px
    padding-bottom: 1px
    font-weight: 600

.project-reward-box-hover
  cursor: pointer

.nav-tab
  cursor: pointer

.date
  float: left

.deliver-at-date
  width: 230px

.loader
  img
    display: none
.card-author-name
  max-height: 3.5em //two lines of height -> 1.5em each line + padding
  overflow: hidden
.card-gone
  color: inherit
  display: block
  text-decoration: none
.card-reward
  color: inherit
  display: block
  text-decoration: none
  .project-reward-box-hover
    opacity: 0
    +transition(opacity 650ms)
  &:hover .project-reward-box-hover
    z-index: 10
    opacity: 1
    +transition(opacity 650ms)
    .project-reward-box-hover-text
      +transform(translateY(-50%) scale(1))

.fb_comments_count_zero
  display: inline

// New contribution page
// fix text-field height conflict
.text-field.back-reward-input-reward
  height: 60px
.w-radio-input.back-reward-radio-button
  height: 20px
  margin-bottom: 0px
  margin-top: 2px

.back-reward-radio-reward
  .badge-success
    display: none
  &.selected
    .badge-success
      display: inline

.list-question
  cursor: pointer
  &.open
    font-weight: 600
    &:before
      font-family: "FontAwesome"
      display: inline-block
      content: "\f105 "
      +transition(all 1s ease)
      +rotate(90deg)

  &:before
    font-family: "FontAwesome"
    display: inline-block
    content: "\f105 "
    +transition(all 1s ease)
.reward-floating
  +transform(translateX(0px) translateY(-100px))
  +transition(transform 500ms)
.reward-floating-display
  display: block
  +transform(translateX(0px) translateY(0px))
  +transition(transform 500ms)

//Fallback for browser that still do not support object-fit
@supports (object-fit: cover)
  #player, .w-lightbox-figure
    position: absolute
    bottom: 0
    top: 0
    left: 0
    right: 0
    width: 100%
    height: 100%
    object-fit: cover

.w-lightbox-close
  background-color: rgba(0, 0, 0, .9)

.w-lightbox-frame
  width: 99%
  height: 99%
.w-lightbox-figure
  position: absolute
  width: 100%
  height: 100%


// Adjusting the grid
.w-col
  .w-col
    &.w-sub-col
      padding-right: 20px
    &.w-sub-col-middle
      padding-right: 20px

@media screen and (min-width: 1200px)
  .w-container
    max-width: 1040px
  .w-col
    padding-right: 20px
    padding-left: 20px
  .w-col
    .w-col
      &.w-sub-col
        padding-right: 40px
      &.w-sub-col-middle
        padding-right: 40px



@media (max-width: 767px)
  .w-col
    .w-col.w-sub-col
      padding-right: 0px


// Edit contribution page

.text-field.checkbox-fix
  display: inline-block
  width: 24px
  height: 24px
  margin: 0

.text-error.w-hidden
  display: none

.hidden
  display: none

.text-color-for-status
  &.rejected, &.failed
    color: #E86666
  &.approved, &.online, &.successful
    color: #00B22D
  &.waiting_funds
    color: #b8b651
.force-text-dark
  color: #3F4752 !important

.field_with_errors
  .text-field
    margin-bottom: 5px
    border-color: #E86666
    background-color: rgba(232, 102, 102, 0.09)

.back-reward-input-reward._2:focus::-webkit-input-placeholder
  padding-top: 0
.back-reward-input-reward._2::-webkit-input-placeholder
  padding-top: 6px

// Links rendered by workable embed
.whr-title a
  color: #409bff
  text-decoration: none
  &:hover
    text-decoration: underline

#project-header h2,
#hero h2,
#learn .headline
  margin-top: 0

// Hero images
.hero-jobs
  background-image: url('/assets/hero-jobs.jpg') !important
  background-position: 50% 50%
  background-size: cover
  color: white

.hero-assets
  background-image: url('/assets/hero-assets.jpg') !important
  background-position: 50% 50%
  background-size: cover
  color: white

.hero-back
  background-image: url('/assets/hero-home.jpg') !important
  background-position: 50% 50%
  background-size: cover
  color: white

.hero-guide
  background-image: url('/assets/hero-guide.jpg') !important
  background-position: 50% 50%
  background-size: cover
  color: white

.hero-search
  background-image: url('/assets/hero-explore.jpg') !important
  background-position: 50% 50%
  background-size: cover
  color: white

.hero-who
  background-image: url('/assets/hero-quemsomos.jpg') !important
  color: white

.hero-profile
  -webkit-filter: blur(15px) brightness(0.75)
  background-position: 50% 50%
  background-size: cover

.hero-half
  width: 100%

//backgrounds hello saiba mais
.hero-hello,
  background-image: url('/assets/hero-hello.jpg') !important
  background-size: cover
  overflow: hidden

.hero-knowmore
  background-image: url('/assets/hero-new-home.jpg') !important
  background-size: cover
  color: white

.hero-hello .w-embed
  position: absolute
  display: block
  width: 100%
  height: 100%
  top: 0
  left: 0
  z-index: 0

.hero-hello .w-embed video
  min-height: 100%
  min-width: 100%
  object-fit: cover

.section-large.hello-idea
  background-image: url('/assets/bg-hello-idea.jpg') !important

.bg-humberto
  background-image: url('/assets/bg-hello-user.jpg') !important

.bg-people
  background-image: url('/assets/bg-hello-people.jpg') !important

.section-large.hello-catarse
  background-image: url('/assets/bg-hello-catarse.jpg') !important

//background imprensa
.bg-projectgrid
  background-image: url('/assets/bg-hello-people.jpg') !important

//search form style
.discover-form
  input[type="text"]
    +input-placeholder
      color: rgba(255,255,255,0.61)
  input[type="text"]:hover
    +input-placeholder
      color: #3F4752

//redactor menu style
.redactor-dropdown .quote
  margin-top: 0
  margin-bottom: 0

.link-footer-inline
  @extend .link-footer
  display: inline



.cd-title
  position: relative
  height: 160px
  line-height: 230px
  text-align: center


.cd-words-wrapper
  display: inline-block
  position: relative
  text-align: left

.cd-words-wrapper b
  display: inline-block
  position: absolute
  white-space: nowrap
  left: 0
  top: 0

.cd-words-wrapper b.is-visible
  position: relative

.no-js .cd-words-wrapper b
  opacity: 0

.no-js .cd-words-wrapper b.is-visible
  opacity: 1



.cd-headline.type .cd-words-wrapper
  vertical-align: top
  overflow: hidden

.cd-headline.type .cd-words-wrapper::after
  /* vertical pulsating cursor bar */
  content: ''
  position: absolute
  right: 0
  top: 50%
  bottom: auto
  height: 90%
  width: 1px
  background-color: #7cc142
  +transform(translateY(-50%))

.cd-headline.type .cd-words-wrapper.waiting::after
  +animation(cd-pulse 1s infinite)

.cd-headline.type .cd-words-wrapper.selected
  background-color: #aebcb9

.cd-headline.type .cd-words-wrapper.selected::after
  visibility: hidden

.cd-headline.type .cd-words-wrapper.selected b
  color: #0d0d0d

.cd-headline.type b
  visibility: hidden
  font-weight: 600

.cd-headline.type b.is-visible
  visibility: visible

.cd-headline.type i
  position: absolute
  visibility: hidden
  font-style: normal

.cd-headline.type i.in
  position: relative
  visibility: visible

@media screen and (max-width: 479px)
  .cd-headline span
    display: block
  .cd-headline .cd-words-wrapper
    display: inline-block

+keyframes(cd-pulse)
  0%
    +transform(translateY(-50%) scale(1))
    opacity: 1

  40%
    +transform(translateY(-50%) scale(0.9))
    opacity: 0

  100%
    +transform(translateY(-50%) scale(0))
    opacity: 0

.u-margintop-25
  margin-top: 25px

//project sidebar
#project-nav
  display: block
  height: 100%
  left: 0
  position: fixed
  top: 0
  width: 205px
  z-index: 999

.project-nav-wrapper
  display: block
  height: 100%
  overflow: hidden
  position: relative
  width: 100%

.dashboard-nav.side
  height: 100%
  overflow: auto
  position: relative
  transition: all 500ms ease
  width: 225px

.dashboard-nav.side::after
  content: " "
  position: fixed
  left: 0px
  right: 0px
  bottom: 0px
  height: 94px
  width: 205px
  background-color: #1d2024
  z-index: 999

#dashboard-links.dashboard-nav-link-left:last-of-type
  margin-bottom: 124px
.dashboard-nav-link-left
  text-align: left
  background: inherit
  border-top: 0
  border-bottom: 0
  outline: none
#project-nav
  +transition(all 500ms ease)
.body-project.closed
  #project-nav
    +transform(translate3d(-205px, 0, 0))
.btn-dashboard
  position: absolute
  margin-left: 205px
  bottom: 0
  left: inherit

.project_budget
  width: 100%

@media screen and (max-width: 991px)
  .body-project::after
    content: " "
    position: fixed
    left: 0px
    top: 0px
    right: 0px
    bottom: 0px
    display: block
    height: 100%
    background-color: rgba(241, 244, 244, 0.87)
    opacity: 0
    pointer-events: none
    transition: all 500ms ease

  .body-project:not(.closed)::after
    opacity: 1

.results-admin-contributions
  overflow-x: none !important
  overflow-y: none !important
  min-height: 125px !important
  height: auto !important

.btn-send-draft-fixed
  z-index: 9999

#new-admin
  min-height: 90vh
  display: block

.arrow-admin
  background: none
  border: none
  position: relative
  top: auto
